<template>
    <div class="box">
        <header>
        </header>
        <div class="content">
            <div>
                <van-area title="城市选择" cancel-button-text="返回" :area-list="areaList" @cancel="cancel"
                    @confirm="queding">
                </van-area>
            </div>
        </div>
    </div>
</template>
<script>
import Vue from "vue";
import { NavBar, IndexBar, IndexAnchor, Cell, CellGroup, Area } from "vant";
import { areaList } from '@vant/area-data';

Vue.use(Area);
Vue.use(Cell);
Vue.use(CellGroup);
Vue.use(IndexBar);
Vue.use(IndexAnchor);
Vue.use(NavBar);

export default {
    data() {
        return {
            areaList,
            citylist: []
        };
    },
    methods: {
        // 确定
        queding(abc) {
            // console.log(abc);
            this.citylist = abc
            // console.log(this.citylist);
            this.$bus.$emit("mos", this.citylist)
            this.$router.push('/home');
        },
        // 返回
        cancel() {
            this.$router.back()
        }
    },
};
</script>
